<template>
  <div class="content">
    <div class="menu">
      <div
        class="menu-icon"
        v-for="(item1, index1) in List"
        :key="index1"
        @click="_openMenu(item1)"
      >
        <!-- <img :src="require('../../assets/Images/AppIcon/'+item1.url+'.png')" alt="" /> -->
        <van-badge
          :content="cnObj[item1.MenuModuleType]"
          max="99"
          v-if="cnObj[item1.MenuModuleType] > 0"
        >
          <img :src="item1.url" alt="" />
        </van-badge>
        <img :src="item1.url" alt="" v-if="!cnObj[item1.MenuModuleType]" />
        <div class="icon-title">{{ item1.MenuName }}</div>
      </div>
    </div>
  </div>
</template> 
<script>
import Tabbar from "@/components/Tabbar.vue";
import { getMenuList } from "@/api/sysPhoneMenu.js";
import toTree from "@/utils/toTree.js";
export default {
  components: {
    Tabbar,
  },
  data() {
    return {
      List:[],
      menuList: [],
      url: "",
      list: [],
      cnObj: {},
    };
  },
  created() {
    // this.List = JSON.parse(this.$route.query.List);
    this.getMenuList()
  },
  methods: {
    // 打开菜单
    _openMenu(item) {
      if (item.LinkUrl) {
        var linkUrl = item.LinkUrl;
        if (item.LinkUrl.includes("/h5/#/")) {
          linkUrl = item.LinkUrl.substring(6);
        }
        this.$router.push("/" + linkUrl);
      } else if (item.MenuModuleType) {
        console.log("https=======>", item.MenuModuleType);
        if (item.MenuModuleType == "RegulationManual") {
          this.$router.push({
            path: "/" + item.MenuModuleType,
            query: {
              title1: "现行手册",
              title2: "意见征询",
              titleCode: item.MenuModuleType,
            },
          });
        } else if (item.MenuModuleType == "RegulationOperation") {
          this.$router.push({
            path: "/" + item.MenuModuleType,
            query: {
              title1: "现行操作规程",
              title2: "意见征询",
              titleCode: item.MenuModuleType,
            },
          });
        } else if (item.MenuModuleType == "GuidelineReg") {
          this.$router.push({
            path: "/" + item.MenuModuleType,
            query: {
              title1: "现行制度",
              title2: "待签字",
              titleCode: item.MenuModuleType,
            },
          });
        } else if (item.MenuModuleType == "GuidelineRegCommonCompile") {
          this.$router.push({
            path: "/" + item.MenuModuleType,
            query: {
              title1: "汇编制度",
              title2: "待签字",
              titleCode: item.MenuModuleType,
            },
          });
        } else if (item.MenuModuleType == "PlanEmergencyResourcePosition") {
          this.$router.push({
            path: "/" + item.MenuModuleType,
            query: {
              title1: "应急物资管理",
              title2: "应急物资问题清单",
              titleCode: item.MenuModuleType,
            },
          });
        } else if (item.MenuModuleType == "PlanEmergencyOrgTeam") {
          this.$router.push({
            path: "/" + item.MenuModuleType,
            query: {
              title1: "应急响应团队管理",
              title2: "应急响应团队一览",
              titleCode: item.MenuModuleType,
            },
          });
        } else if (item.MenuModuleType == "PlanEmergencyContactExternal") {
          this.$router.push({
            path: "/" + item.MenuModuleType,
            query: {
              title1: "公司应急响应团队通讯录",
              title2: "主管部门及社会救援力量通讯录",
              title3: "周边单位应急通讯录",
              titleCode: item.MenuModuleType,
            },
          });
        } else if (item.MenuModuleType == "PlanEmergencyFileManage") {
          this.$router.push({
            path: "/" + item.MenuModuleType,
            query: {
              title1: "现行预案文件",
              title2: "预案文件管理",
              titleCode: item.MenuModuleType,
            },
          });
        } else if (item.MenuModuleType == "PlanSimpleDrillPlan") {
          this.$router.push({
            path: "/" + item.MenuModuleType,
            query: {
              title1: "应急演练计划",
              title2: "演练准备与实施",
              titleCode: item.MenuModuleType,
            },
          });
        } else if (item.MenuModuleType == "	PlanEmergencyResourcePosition") {
          this.$router.push({
            path: "/" + item.MenuModuleType,
            query: {
              title1: "应急物资管理",
              title2: "应急物资问题清单",
              titleCode: item.MenuModuleType,
            },
          });
        } else if (item.MenuModuleType == "PlanEmergencyOrgTeam") {
          this.$router.push({
            path: "/" + item.MenuModuleType,
            query: {
              title1: "应急响应团队管理",
              title2: "应急响应团队一览",
              titleCode: item.MenuModuleType,
            },
          });
        } else if (item.MenuModuleType == "PlanEmergencyContactExternal") {
          this.$router.push({
            path: "/" + item.MenuModuleType,
            query: {
              title1: "公司应急响应团队通讯录",
              title2: "主管部门及社会救援力量通讯录",
              title3: "周边单位应急通讯录",
              titleCode: item.MenuModuleType,
            },
          });
        }
        else if (item.MenuCode == "DangerCheckTask_Corrective1") {
          this.$router.push({
                path: "/Danger/JGFormulatedList2",
                query: {},
            });
        }
        else if (item.MenuCode == "DangerCheckPlan_List") {
          this.$router.push({
                path: "/Danger/checkplan",
                query: {editable:true},
            });
        }
        else if (item.MenuCode == "DangerCheckTask_List") {
          this.$router.push({
                path: "/Danger/DangerCheckTaskTaskList",
                query: {editable:true},
            });
        }   else if (item.MenuCode == "DangerCheckTaskDetail_List") {
          this.$router.push({
                path: "/Danger/DangerCheckTaskDetailList",
                query: {editable:true},
            });
        }  else if (item.MenuCode == "MyDangerCheckTask_Corrective") {
          this.$router.push({
                path: "/Danger/JGFormulatedList3",
                query: {editable:true},
            });
        }
        else {
          this.$router.push("/" + item.MenuModuleType);
          return;
        }
      }
    },
    getMenuList() {
      console.log("menulist")
            getMenuList()
                .then((res) => {
                    res.data.forEach((item) => {
                        item.url = process.env.VUE_APP_BASE_API + item.Icon;
                    });
                    this.menuList = toTree(res.data);
                    this.List=this.menuList[0].children[1].children
                    // console.log()
                   
                })
                .catch((err) => {
                    console.log("err", err);
                });
    },
  },
};
</script>
<style lang="less" scoped>
.content {
  height: 100%;
}
.menu {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  border-bottom: 1px solid #eee;
  margin-bottom: 20px;
  // background: #fff;
  .menu-icon {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 46%;
    font-size: 12px;
    margin-bottom: 15px;
    background: #fff;
    padding: 10px;
    margin-left: 10px;
    border-radius: 5px;
    img {
      width: 50px;
      height: 50px;
      margin-bottom: 10px;
      border-radius: 50%;
    }
  }
}
</style>
